/*
* Tencent is pleased to support the open source community by making WeUI available.
* 
* Copyright (C) 2017 THL A29 Limited, a Tencent company. All rights reserved.
* 
* Licensed under the MIT License (the "License"); you may not use this file except in compliance
* with the License. You may obtain a copy of the License at
* 
*       http://opensource.org/licenses/MIT
* 
* Unless required by applicable law or agreed to in writing, software distributed under the License is
* distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND,
* either express or implied. See the License for the specific language governing permissions and
* limitations under the License.
*/

@import "../../base/fn";

.weui-agree {
  display: inline-flex;
  vertical-align: bottom;
  max-width: 100%;
  text-align: justify;
  .hyphens;

  line-height: 1.4;
  font-size: 14px;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

  a,
  navigator {
    color: @weuiLinkColorDefault;
  }
  navigator {
    display: inline;
  }
}
.weui-agree__text {
  color: @weuiTextColorDesc;
  margin-left: 2px;
  min-width: 0;
}
.weui-agree__checkbox {
  appearance: none;
  display: inline-block;
  border: 0;
  outline: 0;
  vertical-align: middle;
  background-color: currentColor;
  mask-position: 50% 50%;
  mask-repeat: no-repeat;
  mask-size: 100%;
  mask-image: url(data:image/svg+xml,%3Csvg%20width%3D%221000%22%20height%3D%221000%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M500%20916.667C269.881%20916.667%2083.333%20730.119%2083.333%20500%2083.333%20269.881%20269.881%2083.333%20500%2083.333c230.119%200%20416.667%20186.548%20416.667%20416.667%200%20230.119-186.548%20416.667-416.667%20416.667zm0-50c202.504%200%20366.667-164.163%20366.667-366.667%200-202.504-164.163-366.667-366.667-366.667-202.504%200-366.667%20164.163-366.667%20366.667%200%20202.504%20164.163%20366.667%20366.667%20366.667z%22%20fill-rule%3D%22evenodd%22%20fill-opacity%3D%22.9%22%2F%3E%3C%2Fsvg%3E);
  color: @weuiLineColorDark;
  width: 1em;
  height: calc(1em * (14 * 1.4 / 17));
  font-size: 17px;
  flex-shrink: 0;
  margin-top: 0;
}
.weui-agree__checkbox-check { // 兼容小程序
  opacity: 0;
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.weui-agree__checkbox:checked,
.weui-agree__checkbox-check[aria-checked="true"] + .weui-agree__checkbox {
  mask-image: url(data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M12%2022C6.477%2022%202%2017.523%202%2012S6.477%202%2012%202s10%204.477%2010%2010-4.477%2010-10%2010zm-1.177-7.86l-2.765-2.767L7%2012.431l3.119%203.121a1%201%200%20001.414%200l5.952-5.95-1.062-1.062-5.6%205.6z%22%2F%3E%3C%2Fsvg%3E);
  color: @weuiColorPrimary;
}
.weui-agree_warn {
  .weui-agree__text {
    color: var(--weui-RED);
  }
}
.weui-agree_animate {
  animation: weuiAgree 0.3s 1;
}

@keyframes weuiAgree {
  0% {
    transform: translateX(0);
  }

  16% {
    transform: translateX(-8px);
  }

  28% {
    transform: translateX(-16px);
  }

  44% {
    transform: translateX(0);
  }

  59% {
    transform: translateX(-16px);
  }

  73% {
    transform: translateX(0);
  }

  82% {
    transform: translateX(16px);
  }

  94% {
    transform: translateX(8px);
  }

  100% {
    transform: translateX(0);
  }
}
